<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
		<!-- 引入vue -->
		<script src="js/vue.js"></script>
	</head>
	<body>
		<div id="app">
			<!-- 视图  肉体 -->
			姓名：{{name}} <br>
			年龄：{{age}}<br>
			性别：{{sex}}<br>
			身高：{{h}}cm<br>
			体重：{{w}}kg
			<hr>
			<input v-model="name" type="text">
			<hr>
			{{msg}}
			<p v-text='msg'></p>
			<p v-html='msg'></p>
		</div>
		<script>
			const app=Vue.createApp({
				data() {   //静态属性  数据
					return{
						name:'张三',
						age:18,
						sex:'女',
						h:165,
						w:60,
						msg:'hello <b>vue</b>!'
					}
				}
			}).mount("#app")
		</script>
	</body>
</html>